<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>设计模式-传道解惑的架构师博客</title>
    <link rel="stylesheet" href="css/reset.css">
    <link rel="stylesheet" href="css/font-awesome.css">
    <link rel="stylesheet" href="css/blog.css">
</head>
<body>
    <!-- 顶部导航 -->
    <header id="top">
        <nav class="nav">
            <a href="index.html" class="logo">
                <img src="img/jdon100.png">
            </a>
            <ul class="menu">
                <!-- <li class=""><a href="category.html">面向对象</a></li>
                <li><a href="#">设计模式</a></li>
                <li><a href="#">领域驱动设计</a></li>
                <li><a href="#">微服务</a></li>
                <li><a href="#">企业架构</a></li>
                <li><a href="#">编程</a></li>
                <li><a href="#">分布式</a></li>
                <li><a href="#">编程</a></li>
                <li><a href="#">学习教程</a></li> -->
            </ul>
            <ul class="share">
                <li><a href="#"><i class="fa fa-weibo"></i></a></li>
                <li><a href="#"><i class="fa fa-weixin"></i></a></li>
                <li><a href="#"><i class="fa fa-qq"></i></a></li>
            </ul>
        </nav>
    </header>

    <!-- 主体内容 -->
    <div class="container">
        <!-- 左边 -->
        <div class="main_left" >
            <ul id="list">
            </ul>

            <!-- 模板1: 
            
            id: 7
like: 10
sub_title: "本篇主要为说明使用面向对象的分析和设计方法可以帮助更快地认识事物，更快地排除编程设计过程一个个拦路虎。"
title: "用OO方法解一道算术题"
username: "future"
view: 129
-->
            <script id="list_tpl" type="text/html">
                {{if result.length == 0}}
                 <li>暂无数据!</li>
                {{/if}}

                {{each result}}
                <li>
                    <h3><a href="detail.html?id={{$value.id}}">{{$value.title}}</a></h3>
                    <div class="census">
                        <span><i class="fa fa-calendar"></i>{{$value.ctime|dateFormat}}</span>
                        <span><i class="fa fa-eye"></i>{{$value.view}}</span>
                        <span><i class="fa fa-heart"></i>{{$value.like}}</span>
                        <span><i class="fa fa-user"></i>{{$value.username}}</span>
                    </div>
                    <div class="info">
                        <div class="pic">
                            <a href="detail.html?id={{$value.id}}">
                                <img src="{{$value.pic}}">
                            </a>
                        </div>
                        <p>
                            {{$value.sub_title}}...
                            <a href="detail.html?id={{$value.id}}">详细</a>
                        </p>
                    </div>
                </li>
                {{/each}}
            </script>

            <!-- 分页 -->
            <!-- <div class="page">
                <span>共 3 页</span>
                <a href="#">上一页</a>
                <a href="#">1</a>
                <a href="#" class="active">2</a>
                <a href="#">3</a>
                <a href="#">下一页</a>
            </div> -->

        </div>

        <!-- 右边 -->
        <div class="main_right">
            <form action="#" class="search">
                <input type="text" placeholder="Search">
            </form>

            <div class="ad">
                <a href="#">
                    <img src="img/ad.jpg">
                </a>
            </div>

            <div class="likes">
                <h3>点赞</h3>
                <ul>
                    <li><a href="#">为什么Web3亮点在于其数据库？</a></li>
                    <li><a href="#">随着复杂性的增加，层次结构的用处越来越小？ </a></li>
                    <li><a href="#">随着复杂性的增加，层次结构的用处越来越小？ </a></li>
                    <li><a href="#">随着复杂性的增加，层次结构的用处越来越小？ </a></li>
                    <li><a href="#">随着复杂性的增加，层次结构的用处越来越小？ </a></li>
                    <li><a href="#">随着复杂性的增加，层次结构的用处越来越小？</a></li>
                    <li><a href="#">随着复杂性的增加，层次结构的用处越来越小？ </a></li>
                    <li><a href="#">随着复杂性的增加，层次结构的用处越来越小？ </a></li>
                    <li><a href="#">随着复杂性的增加，层次结构的用处越来越小？ </a></li>
                </ul>
            </div>

            <div class="likes">
                <h3>最新</h3>
                <ul>
                    <li><a href="#">为什么Web3亮点在于其数据库？</a></li>
                    <li><a href="#">随着复杂性的增加，层次结构的用处越来越小？ </a></li>
                    <li><a href="#">随着复杂性的增加，层次结构的用处越来越小？ </a></li>
                    <li><a href="#">随着复杂性的增加，层次结构的用处越来越小？ </a></li>
                    <li><a href="#">随着复杂性的增加，层次结构的用处越来越小？ </a></li>
                    <li><a href="#">随着复杂性的增加，层次结构的用处越来越小？</a></li>
                    <li><a href="#">随着复杂性的增加，层次结构的用处越来越小？ </a></li>
                    <li><a href="#">随着复杂性的增加，层次结构的用处越来越小？ </a></li>
                    <li><a href="#">随着复杂性的增加，层次结构的用处越来越小？ </a></li>
                </ul>
            </div>
        </div>
    </div>

    <!-- 底部 -->
    <footer id="footer">
        <div>
            <a href="#">关注解道</a>|
            <a href="#">关于解道</a>|
            <a href="#">联系解道</a>
        </div>
        <p>Copyright © 2022 ddd.com 沪ICP备120334648号-1</p>
    </footer>
    
    <script src="js/axios.min.js"></script>
    <script src="js/nav.js"></script>

    <script src="js/qs.min.js"></script>
    <script src="js/template-web.js"></script>
    <script src="js/dayjs.min.js"></script>
    <script src="js/category.js"></script>
</body>
</html>